<template>
	<!-- 运费模板列表 -->
	<view class="f_wp">
		<view class="f_list">
			<view class="f_item" @click="$navTo('../business/freighttemplate?type=edit&temid=12')">
				<view class="f_item_info">
					<view>
						<text class="f_item_info_text">ID：1136</text><text>计费方式：</text>
					</view>
					<view class="f_name">模板名称：测试测试测试测试测试测试测试测试测试测试测试测试</view>
				</view>
				<view class="f_i_buttons">
					<text class="yticon icon-bianji"></text>
					<text class="iconfont icon-shanchu"></text>
				</view>
			</view>
		</view>
		<view class="f_button" @click="$navTo('../business/freighttemplate?type=add&temid=12')">添加模板</view>
	</view>
</template>

<script>
	export default {

	}
</script>

<style lang="scss">
	@import "/store/icon.css";

	page {
		background-color: #f2f2f2;
		color: $font-color-base;
	}

	.f_wp {
		padding-bottom: 130upx;
		padding: 0 20upx 130upx;
	}

	.f_item {
		background-color: #fff;
		border-radius: 10upx;
		display: flex;
		align-items: center;
		margin-top: 20upx;
		padding: 20upx;
	}

	.f_item_info {
		flex: 1;
		overflow: hidden;
	}

	.f_item_info_text {
		margin-right: 20upx;
	}

	.f_name {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.f_i_buttons text {
		color: #00AA00;
		font-size: 40upx;
		margin-left: 20upx;
	}

	.f_i_buttons text:nth-of-type(2) {
		color: $base-color;
		font-size: 48upx;
	}

	.f_button {
		background-color: $base-color;
		border-radius: 10upx;
		color: #fff;
		position: fixed;
		bottom: 40upx;
		line-height: 70upx;
		margin: 0 auto;
		text-align: center;
		width: 94%;
	}
</style>
